<template>
  <div class="register-view">
    <van-nav-bar
     title="注册"
     left-text="返回"
     left-arrow
     @click-left="router.back()"
    />
    <van-form @submit="register">
      <van-cell-group inset>
        <van-field v-model="username" label="账号" placeholder="请输入用户名" autocomplete="username" :rules="[
    {
      pattern: /^[a-zA-Z0-9_]{3,12}$/,
      message: '请输入3到12位字母、数字或下划线',
      trigger: 'onChange'
    }
  ]"  />
        <van-field v-model="password" label="密码" placeholder="请输入密码" type="password" autocomplete="current-password" :rules="[
    {
      pattern: /^\d{6,12}$/,
      message: '请输入6-12位数字',
      trigger: 'onChange'
    }
  ]"/>
      </van-cell-group>
      <div style="margin: 16px;">
        <van-button round block type="primary" native-type="submit">
          提交
        </van-button>
      </div>
    </van-form>
  </div>
</template>

<script setup lang="ts">

  import { showFailToast } from "vant";
import { getUserData } from "../api"
  const router = useRouter();

  const username = ref("");
  const password = ref("");

  const register = async()=>{
    let result = await getUserData({username: username.value, password: password.value, status: "register"});
    console.log(result)
    if(result.data.code != "0"){
      showFailToast(`用户用户名已被注册！`);
      return
    }
    showFailToast(`注册成功`);
    router.push({path:"login"})
  }

</script>

<style scoped>

</style>
